<template>
  <div class="cartTop">
      <div class="cartInfo">
        <p class="title">商品清单</p>
        <div class="item">
          <ul>
            <li v-for="item in cartList">
              <router-link tag="p" class="name" :to="'prcShow?id='+item.goods_id"><img :src="ksrc+item.goods_logo"></router-link>
              <router-link tag="p" class="name" :to="'prcShow?id='+item.goods_id">{{item.goods_name}}</router-link>
              <p class="price">£{{item.goods_price|allPrice}}</p>
              <p class="number">X {{item.goods_count}}</p>
              <p class="sPrice">£{{item.amount|allPrice}}</p>
              <span class="del" @click="delPrc(item.id)"></span>
            </li>
          </ul>
        </div>
        <div class="clickBox">
          <p>总价</p>
          <p class="allPrice">£{{allPrice|allPrice}}</p>
          <button @click="goCart">进入购物车</button>
        </div>
      </div>
  </div>
</template>

<script>
import {Get,Delete} from '@/config/api.js'
export default {
  name: 'hello',
  props:['cartList'],
  data () {
    return {
      ksrc:'http://oub2urxei.bkt.clouddn.com/'
    }
  },
  mounted(){
    //this.getData()
  },
  computed: {
    //商品
    allPrice: function() {
      let num=0;
      for (var i = 0; i < this.cartList.length; i++) {
        num+=this.cartList[i].amount
      }
      return num.toFixed(2)
    }
  },
  methods:{
    goCart(){
      this.$store.dispatch("cartClose")
      document.body.setAttribute("class","");
      this.$router.push('/cart')
    },
    async getData(e){
        if(this.vLogin()){
          await Get('/carts?_sort=id',this.$store.state.token).then(function(reg){
            this.cartList=reg.data
          })
          
        }
    },
    async delPrc(e){
        if(this.vLogin()){
          let reg=await Delete('/carts/'+e,this.$store.state.token)
          alert('删除成功')
          this.$emit('getNow'); 
        }
    }
  }
}
</script>

